<template>
	<view class="lawyer">


		<view v-if="list1.length" class="list">
			<view class="item" v-for="item in list1" @click="navTo(item)">
				<view class="photo">
					<image :src="item.image" mode="widthFix"></image>
				</view>

				<view class="info">
					<view class="name">
						<view class="real">
							{{item.name}}
						</view>
						<view class="tel">
<!--  @click="ask(item)" -->
							<u-button @click="navTo(item)" shape="circle" type="primary" :ripple="true"
								ripple-bg-color="#909399">电话咨询</u-button>
						</view>
					</view>
					<view class="year">
						{{item.typelable}} <text class="line"></text> 执业{{item.beendate}}年
					</view>
					<view class="desc">
						参与解答{{item.seekcount}}次备份
					</view>
					<view class="sc">
						擅长：{{item.remark}}
					</view>
				</view>
			</view>
			<uni-load-more :status="status"></uni-load-more>
		</view>
		<view v-else class="empty" style="padding-top: 150px;">
			<view v-if="!list1.length && senDate" class="emptyAddress-box">
				<u-empty src="https://zzdiy-prod.oss-cn-chengdu.aliyuncs.com/zzdiy_seller/empty.png" icon-size="300"
					text="暂无数据" mode="data"></u-empty>
			</view>
		</view>
	</view>
</template>

<script>
		import {
			checkLogin,
			checkIsVip,
			checkLoginAndIsVip
		} from '../../../utils/checklogin.js'
	export default {
		data() {
			return {
				total: null, //总共多少条数据
				formData: {
					pageSize: 10, //每页10条数据
					page: 1, //第几页
				},
				status: "more",
				senDate: false,
				list1: [],
				city: ''
			}
		},
		onLoad() {
			this.getmoldList()
		},
		onReachBottom() {
			let allTotal = this.formData.page * this.formData.pageSize;
			if (allTotal < this.total) {
				//当前条数小于总条数 则增加请求页数
				this.status = "loading"; //加载中状态
				this.formData.page++;
				this.getmoldList()
			} else {
				this.status = "noMore"; //加载完状态
				console.log("已加载全部数据");
			}
		},

		methods: {
			ask(item){
				if (checkLoginAndIsVip(this)) {
					console.log('我都蛮子了');
				
					uni.makePhoneCall({
						phoneNumber: item.phone, // 电话号码
						success: function() {
							console.log('拨打电话成功！');
						},
						fail: function(err) {
							console.log('拨打电话失败：', err);
						}
					});
				}
			},
			getmoldList() {
				this.senDate = false;
				let query = {

					city_name: this.vuex_userCity,
					page: this.formData.page,
					limit: this.formData.pageSize,
				}

				this.$u.api
					.lawyerlists(query)
					.then((res) => {

						this.senDate = true;
						if (res) {

							console.log(res, 999988)
							this.total = res?.data?.count;
							const newlist = res?.data?.list;
							this.list1.push(...newlist);
							if (this.list1.length < this.formData.pageSize) {
								this.status = "noMore"; //加载完状态
							}

						} else {

						}
					});
			},

			navTo(item) {
				
				uni.navigateTo({
					url: `/pages/sys/home/detail?id=${item.id}`
				});
			},
		}
	};
</script>

<style>
	page {
		background: #F8F8F8;
	}
	.interlayer view {
		width: 100% !important;
		
		/* /deep/ {
			width: 100% !important;
		} */
		
	}
</style>
<style lang="scss" scoped>
	
	.list {
		padding: 24rpx 46rpx 0 32rpx;
	}

	.item {
		display: flex;
		padding-bottom: 24rpx;
		margin-bottom: 24rpx;
		border-bottom: 1rpx solid #DBDDE1;

		&:last-child {
			border-bottom: none;
		}

		.photo {
			width: 145rpx;
			height: 145rpx;
			border-radius: 22rpx;
			overflow: hidden;
			margin-right: 33rpx;

			image {
				width: 145rpx;
				height: 145rpx;
			}
		}

		.info {
			flex: 1;

			.name {
				display: flex;
				align-items: center;
				justify-content: space-between;

				.real {
					font-family: PingFangSC, PingFang SC;
					font-weight: 500;
					font-size: 32rpx;
					color: #000000;
					line-height: 45rpx;
				}

				.tel {
					width: 136rpx;
					height: 57rpx;

					/deep/ .u-size-default {
						font-family: PingFangSC, PingFang SC;
						font-weight: 500;
						font-size: 24rpx !important;
						color: #00B9A7;
						line-height: 33rpx;
						height: 57rpx;
					}

					/deep/ .u-btn--primary {
						color: #00B9A7 !important;

						background: rgba(0, 185, 167, 0.15) !important;
						border-radius: 32rpx;
					}
				}

			}

			.year {
				font-family: PingFangSC, PingFang SC;
				font-weight: 400;
				font-size: 26rpx;
				color: #6B6D72;
				line-height: 37rpx;
				display: flex;
				align-items: center;

				text {
					display: inline-flex;
					width: 1rpx;
					height: 23rpx;
					background: #A2A9BB;
					margin: 0 12rpx;
				}
			}

			.desc {
				font-family: PingFangSC, PingFang SC;
				font-weight: 400;
				font-size: 26rpx;
				color: #6B6D72;
				line-height: 37rpx;
				margin: 16rpx 0;
			}

			.sc {
				font-family: PingFangSC, PingFang SC;
				font-weight: 400;
				font-size: 26rpx;
				color: #6B6D72;
				line-height: 37rpx;
			}
		}
	}
</style>